<!-- 管理员:课程考核管理:题库和在线考试管理:在线考试:查看考试 -->
<template><div style="width:100% !important;padding:20px;">
  <div>
    <el-row type="flex" align="middle">
      <el-form inline="true" label-suffix="：">
        <el-form-item label="学期">
          <el-select
            v-model="queryForm.semester" size="mini"
            placeholder="请选择" style="width:100px;"
          >
            <el-option
              v-for="item in semesterArray"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="系">
          <el-select
            v-model="queryForm.semester" size="mini"
            placeholder="请选择" style="width:100px;"
          >
            <el-option
              v-for="item in semesterArray"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="状态">
          <el-select
            v-model="queryForm.semester" size="mini"
            placeholder="请选择" style="width:100px;"
          >
            <el-option
              v-for="item in semesterArray"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="考试课程">
          <el-input size="mini" />
        </el-form-item>
        <el-form-item>
          <el-button plain size='mini' icon="el-icon-search" type="primary" style="width:70px;">查询</el-button>
        </el-form-item>
      </el-form>
    </el-row>
        <el-table
          :data="tableData"
          border
          class="table-data"
          row-class-name="dun-row-class"
          cell-class-name="dun-cell-class"
          header-row-class-name="dun-header-row-class"
          header-cell-class-name="dun-header-cell-class"
          :cell-style="{ borderColor: '#004ca7'}"
          :header-cell-style="{ borderColor: '#004ca7', backgroundColor: '#eef1f9'}"
        >
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column prop="clazzName" label="姓名" align="center" />
          <el-table-column prop="clazzName" label="学号" align="center" />
          <el-table-column prop="clazzName" label="培养层次" align="center" />
          <el-table-column prop="clazzName" label="班级" align="center" />
          <el-table-column prop="clazzName" label="考试课程" align="center" />
          <el-table-column prop="clazzName" label="考试状态" align="center" />
          <el-table-column prop="clazzName" label="试卷类型" align="center" />
          <el-table-column prop="clazzName" label="试卷编号" align="center" />
          <el-table-column prop="clazzName" label="操作" align="center">
            <template slot-scope="scope">
                <el-button :plain=true
                  @click="onBtnMarkingClickHandler()"
                  size="mini"
                  type="warning" style="width:80px;height:28px;"
                  icon="el-icon-edit">阅 卷</el-button>
            </template>
          </el-table-column>
        </el-table>
      <div class="pagineDescPane">
        <el-button plain style="height:28px;" type="warning" icon="el-icon-upload2" size="mini">导出 Excel</el-button>
      </div>
      <div class="pagineDescPane">
        当前共找到 {{ resultPagin.totalCount }} 条记录，当前显示 {{ resultPagin.start }} - {{ resultPagin.end }} 条。
      </div>
      <div class="pagineBtnPane">
        <el-button style="width:80px;" size='mini'>＜ 上一页</el-button>
        <el-button size='mini'>1</el-button>
        <el-button size='mini'>…</el-button>
        <el-button size='mini'>30</el-button>
        <el-button size='mini'>…</el-button>
        <el-button size='mini'>60</el-button>
        <el-button style="width:80px;" size='mini'>下一页 ＞</el-button>
        <span style="display:inline-block;width:40px;"></span>
        前往 <el-input size='mini' style="display:inline-block;width:40px;"/> 页
      </div>
  </div>

</div></template>
<script>

export default {
  data() {
    return {
      semesterArray: [{label: '2021下', value: '2021下'},{label: '2022上', value: '2022上'}],
      queryForm: {
        semester: ''
      },
      resultPagin: {
        totalCount: 200,
        currentPage: 3,
        perPageCount: 50,
        start: 51,
        end: 100
      },
      tableData: [{},{},{}]
    }
  },
  methods: {
    onBtnMarkingClickHandler: function() {
      this.$router.push({
        path: '/admin/courseAssessment/questionExamination/onlineTest/marking'
      })
    }
  }
}
</script>

<style lang="less" scoped>
@import "../../courseAssessment.less";
</style>

<style lang="less" scoped>
.pagineDescPane {
  padding: 10px 0px 0px 0px;
  font-size: 14px;
  font-weight: normal;
  font-family: "Microsoft YaHei";
  color: #004ca7;
}
.pagineBtnPane {
  text-align: center;
  padding: 10px;
  font-size: 14px;
  font-weight: normal;
  font-family: "Microsoft YaHei";
  color: #004ca7;
}
.pagineBtnPane > button {
  color: #004ca7;
  width: 30px;
  height: 28px;
  padding-left: 0px;
  padding-right: 0px;
  border: 1px solid #004ca7;
}
@import "../../courseAssessmentScoped.less";
</style>